beerape/frontend-fastposter
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: beerape:275c5f3531fc6077e637a87a595bc06a91a99486
Branches Tags
beerape:master
beerape:feature-20250615-YGD开发分支
..
compare: beerape:b23c812e4279f150aae2e6e52ceeaecf00bd4fc2
Branches Tags
beerape:master
beerape:feature-20250615-YGD开发分支

No commits in common. "275c5f3531fc6077e637a87a595bc06a91a99486" and "b23c812e4279f150aae2e6e52ceeaecf00bd4fc2" have entirely different histories.
275c5f3531 ... b23c812e42

1 changed files with 32 additions and 78 deletions
Show Stats Expand all files Collapse all files

110
src/components/fastposter/aside/extend/FpAsideComponent.vue
View File

@ -1,51 +1,24 @@
<template>
<div class="panel">
<div class="title">
<h3>组件</h3>
</div>
<div class="list-wrapper">
<div class="list">
<el-collapse>
<el-collapse-item title="酒款信息组件" name="1">
<fp-aside-panel-component-item
v-for="item in jkxxItems"
@click="addItemToEditor(item)"
:key="item.key"
:icon="item.t"
:title="item.name"
desc="点击创建"/>
</el-collapse-item>
<el-collapse-item title="厂牌信息组件" name="2">
<fp-aside-panel-component-item
v-for="item in cpxxItems"
@click="addItemToEditor(item)"
:key="item.key"
:icon="item.t"
:title="item.name"
desc="点击创建"/>
</el-collapse-item>
<el-collapse-item title="市售规格组件" name="3">
<fp-aside-panel-component-item
v-for="item in ssggItems"
@click="addItemToEditor(item)"
:key="item.key"
:icon="item.t"
:title="item.name"
desc="点击创建"/>
</el-collapse-item>
<el-collapse-item title="其它常用组件" name="4">
<fp-aside-panel-component-item
v-for="item in qtcyItems"
@click="addItemToEditor(item)"
:key="item.key"
:icon="item.t"
:title="item.name"
desc="点击创建"/>
</el-collapse-item>
</el-collapse>
<fp-aside-panel-component-item
v-for="item in items"
@click="addItemToEditor(item)"
:key="item.t"
:icon="item.t"
:title="item.name"
desc="点击创建"/>
</div>
</div>
</div>
</template>
<script>
import { uniqueId } from '@/store/modules/fastposter/poster'
import { mapMutations } from "vuex"
import FpAsidePanelComponentItem from "./FpAsideComponentItem"
export default {
@ -53,45 +26,20 @@ export default {
components: {FpAsidePanelComponentItem},
data() {
return {
// 酒款信息组件
jkxxItems: [
{t: 'text', name: '酒款名称', key: 'jkxx_jkmc', v: '请输入酒款名称', w: 300, h: 42, s: 42},
{t: 'text', name: '酒款英语名称', key: 'jkxx_jkywmc', v: '请输入酒款英语名称', w: 400, h: 42, s: 42},
{t: 'image', name: '酒款图片', key: 'jkxx_jktp', v: 'https://fastposter.net/dassets/default.png', w: 200},
{t: 'image', name: '鱼眼标', key: 'jkxx_yyb', v: 'https://fastposter.net/dassets/default.png', w: 200},
{t: 'text', name: '酒款系列', key: 'jkxx_jkxl', v: '请输入酒款系列', w: 300, h: 42, s: 42},
{t: 'text', name: '啤酒风格', key: 'jkxx_pjfg', v: '请输入啤酒风格', w: 300, h: 42, s: 42},
{t: 'text', name: '啤酒风格英语', key: 'jkxx_pjfgyw', v: '请输入啤酒风格英语', w: 400, h: 42, s: 42},
{t: 'text', name: '酒精度数', key: 'jkxx_jjds', v: '请输入酒精度数', w: 300, h: 42, s: 42},
{t: 'text', name: '苦度值', key: 'jkxx_kdz', v: '请输入苦度值', w: 300, h: 42, s: 42},
{t: 'text', name: '原麦汁', key: 'jkxx_ymz', v: '请输入原麦汁', w: 300, h: 42, s: 42},
{t: 'text', name: '产品介绍', key: 'jkxx_cpjs', v: '请输入产品介绍', w: 300, h: 42, s: 42},
{t: 'text', name: '星球评分', key: 'jkxx_xqpf', v: '请输入星球评分', w: 300, h: 42, s: 42},
],
// 厂牌信息组件
cpxxItems: [
{t: 'text', name: '品牌名称', key: 'cpxx_ppmc', v: '请输入品牌名称', w: 300, h: 42, s: 42},
{t: 'text', name: '品牌英语名称', key: 'cpxx_ppywmc', v: '请输入品牌英语名称', w: 400, h: 42, s: 42},
{t: 'text', name: '品牌所在地', key: 'cpxx_ppszd', v: '请输入品牌所在地', w: 400, h: 42, s: 42},
{t: 'avatar', name: '品牌LOGO', key: 'cpxx_pplogo', v: 'https://fastposter.net/dassets/default.png', w: 80, h: 80},
],
// 市售规格组件
ssggItems: [
{t: 'text', name: '酒枪编号', key: 'ssgg_jjbh', v: '请输入酒枪编号', w: 300, h: 42, s: 42},
{t: 'text', name: '规格1', key: 'cpxx_gg1', v: '请输入规格1', w: 220, h: 42, s: 42},
{t: 'text', name: '价格1', key: 'cpxx_jg1', v: '请输入规格1的价格', w: 450, h: 42, s: 42},
{t: 'text', name: '规格2', key: 'cpxx_gg2', v: '请输入规格2', w: 220, h: 42, s: 42},
{t: 'text', name: '价格2', key: 'cpxx_jg2', v: '请输入规格2的价格', w: 220, h: 42, s: 42},
],
// 其它常用组件
qtcyItems: [
{t: 'text', name: '文字', key: 'qtcy_text', v: '请输入文字', w: 220, h: 42, s: 42},
{t: 'image', name: '图片', key: 'qtcy_image', v: 'https://fastposter.net/dassets/default.png', w: 200},
{t: 'avatar', name: '头像', key: 'qtcy_avatar', v: 'https://fastposter.net/dassets/default.png', w: 80, h: 80},
{t: 'qrcode', name: '二维码', key: 'qtcy_qrcode', v: 'https://fastposter.net/doc/', w: 120, h: 120, p: 0, c: '#000000', bgc: '#ffffff'},
items: [
{t: 'text', name: '文字', v: '请输入文字', w: 220, h: 42, s: 42},
{t: 'image', name: '图片', v: 'https://fastposter.net/dassets/default.png', w: 200},
{t: 'avatar', name: '头像', v: 'https://fastposter.net/dassets/default.png', w: 80, h: 80},
{
t: 'qrcode',
name: '二维码',
v: 'https://fastposter.net/doc/',
w: 120,
h: 120,
p: 0,
c: '#000000',
bgc: '#ffffff'
},
]
}
},
@ -101,7 +49,7 @@ export default {
'record': 'snapshots/record',
}),
addItemToEditor(item) {
this.addItem({...item, vd:item.key})
this.addItem({...item,vd:item.name+uniqueId(6)})
this.record(`新增组件: ${item.name}`)
document.getElementById('key-down').focus()
},
@ -110,6 +58,12 @@ export default {
</script>
<style scoped>
.title {
padding: 17px 24px;
height: 56px;
box-sizing: border-box;
}
.title h3 {
font-size: 16px;
line-height: 22px;