Skip to content

P
pptist
Commit 136f445f authored by zhengke's avatar zhengke
Browse files
Options

no message

parent 8b97b975
Hide whitespace changes
Inline Side-by-side
Showing with 186 additions and 202 deletions
src/hooks/useImport.ts
View file @ 136f445f
......@@ -120,6 +120,7 @@ export default () => {
id: nanoid(10),
elements: [],
background,
pageType: 1
}
const parseElements = (elements: Element[]) => {
......
src/hooks/useSlideHandler.ts
View file @ 136f445f
......@@ -35,6 +35,7 @@ export default () => {
type: 'solid',
color: theme.value.backgroundColor,
},
pageType: 1
}
slidesStore.updateSlideIndex(0)
mainStore.setActiveElementIdList([])
......@@ -84,6 +85,7 @@ export default () => {
type: 'solid',
color: theme.value.backgroundColor,
},
pageType: 1,
}
mainStore.setActiveElementIdList([])
slidesStore.addSlide(emptySlide)
......
src/mocks/layout.ts
View file @ 136f445f
......@@ -5,6 +5,7 @@ import type { Slide } from '@/types/slides'
export const layouts: Slide[] = [
{
id: 'template',
pageType: 1,
elements: [
{
type: 'shape',
......@@ -80,6 +81,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 2,
elements: [
{
type: 'text',
......@@ -139,6 +141,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 3,
elements: [
{
type: 'shape',
......@@ -188,6 +191,7 @@ export const layouts: Slide[] = [
},
{
id: 'MZVO1kkj',
pageType: 4,
elements: [
{
type: 'shape',
......@@ -273,6 +277,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 4,
elements: [
{
type: 'shape',
......@@ -457,6 +462,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 4,
elements: [
{
type: 'shape',
......@@ -510,6 +516,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 1,
elements: [
{
type: 'text',
......@@ -573,6 +580,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 1,
elements: [
{
type: 'text',
......@@ -690,6 +698,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 1,
elements: [
{
type: 'text',
......@@ -766,6 +775,7 @@ export const layouts: Slide[] = [
},
{
id: 'template',
pageType: 1,
elements: [
{
type: 'shape',
......
src/mocks/slides.ts
View file @ 136f445f
import type { Slide } from '@/types/slides'
// pageType 1基础 2酒店 3景 4餐
export const slides: Slide[] = [
{
id: 'test-slide-1',
pageType: 1,
elements: [
{
type: 'shape',
......@@ -77,6 +79,7 @@ export const slides: Slide[] = [
},
{
id: 'test-slide-2',
pageType: 2,
elements: [
{
type: 'text',
......@@ -136,6 +139,7 @@ export const slides: Slide[] = [
},
{
id: 'test-slide-3',
pageType: 3,
elements: [
{
type: 'shape',
......
src/types/slides.ts
View file @ 136f445f
......@@ -676,6 +676,7 @@ export interface Slide {
background?: SlideBackground
animations?: PPTAnimation[]
turningMode?: TurningMode
pageType: number
}
/**
......
src/views/Editor/DataaSource/index.vue
View file @ 136f445f
......@@ -69,24 +69,27 @@
let obj = slidesData.find((x,index)=>{
return slideIndex.value == index
})
obj&&obj.elements&&obj.elements.forEach(x=>{
let dataObj = datas.DataSource.DataSourceList.find(y=>{
return y.id == x.id
if(obj){
obj.elements.forEach(x=>{
let dataObj = datas.DataSource.DataSourceList.find(y=>{
return y.id == x.id
})
if(dataObj){
x = dataObj
}
savelides.push(x)
})
if(dataObj){
x = dataObj
}
savelides.push(x)
})
obj.elements = savelides
slidesData.forEach((x,index)=>{
if(slideIndex.value == index){
x.elements = obj.elements
obj.elements = savelides
slidesData.forEach((x,index)=>{
if(slideIndex.value == index){
x.pgaeType = datas.DataSource.pgaeType
x.elements = obj.elements
}
newSlides.push(x)
})
if(obj&&obj.TemplateDataSource&&obj.TemplateDataSource.Id){
slidesStore.setSlides(newSlides)
}
newSlides.push(x)
})
if(obj.TemplateDataSource&&obj.TemplateDataSource.Id){
slidesStore.setSlides(newSlides)
}
})
watch(datas.DataSource, (n, o) => {
......
src/views/Editor/EditorHeader/index.vue
View file @ 136f445f
......@@ -109,7 +109,7 @@ import PopoverMenuItem from '@/components/PopoverMenuItem.vue'
const mainStore = useMainStore()
const slidesStore = useSlidesStore()
const { title } = storeToRefs(slidesStore)
const { title, slides } = storeToRefs(slidesStore)
const { enterScreening, enterScreeningFromStart } = useScreening()
const { importSpecificFile, importPPTXFile, exporting } = useImport()
const { resetSlides } = useSlideHandler()
......@@ -137,9 +137,11 @@ const UploadPsd = () => {
// 保存
const setTemplate = async () =>{
console.log(datas.DataSource.DataSourceList,'----保存接口',queryObj.value)
// console.log(JSON.stringify(slides.value),'----保存接口',queryObj.value)
console.log(slides.value,'=============')
if(queryObj.value.Title==''||!queryObj.value.LineId||!queryObj.value.LtId
||queryObj.value.CoverImg==''||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
// ||queryObj.value.CoverImg==''
||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
||queryObj.value.ColorName==''||queryObj.value.ColorStr==''||queryObj.value.LineName==''){
return ElMessage({
showClose: true,
......@@ -147,21 +149,21 @@ const setTemplate = async () =>{
type: 'warning',
})
}
if(datas.DataSource.DataSourceList.length>0){
let obj = datas.DataSource.DataSourceList.find(x=>{
return !x.TemplateDataSource.Id||!x.TemplateDataSource
})
if(!obj){
return ElMessage({
showClose: true,
message: '请绑定数据源',
type: 'warning',
})
for(let i=0;i<slides.value.length;i++){
for(let j=0;j<slides.value[i].elements.length;j++){
if(slides.value[i].elements[j].type=="text"||slides.value[i].elements[j].type=="image"){
if(!slides.value[i].elements[j].TemplateDataSource
||!slides.value[i].elements[j].TemplateDataSource.Id) {
return ElMessage({
showClose: true,
message: `请完善 第 ${i+1} 页 需要绑定的数据源`,
type: 'warning',
})
}
}
}
}
queryObj.value.TempData = JSON.stringify(datas.DataSource.DataSourceList)
return
queryObj.value.TempData = JSON.stringify(slides.value)
datas.loading = true
try {
let TemplateRes = await ConfigService.SetTripTemplateSlide(queryObj.value);
......
src/views/Editor/Thumbnails/index.vue
View file @ 136f445f
......@@ -57,6 +57,7 @@ import useSlideHandler from '@/hooks/useSlideHandler'
import useScreening from '@/hooks/useScreening'
import useLoadSlides from '@/hooks/useLoadSlides'
import { injectKeyDataSource } from '@/types/injectKey'
import ConfigService from '@/services/ConfigService'
import ThumbnailSlide from '@/views/components/ThumbnailSlide/index.vue'
import LayoutPool from './LayoutPool.vue'
......@@ -91,12 +92,40 @@ const {
const datas = reactive({
DataSource:{}
})
const queryObj = ref({} as any)
datas.DataSource = inject(injectKeyDataSource)
// 获取行程模版数据
const GetTripTemplate = async () =>{
try {
let queryMsg = {
TempId:datas.DataSource.queryObj.TempId
}
let dataRes = await ConfigService.GetTripTemplateSlide(queryMsg);
if (dataRes.data.resultCode == 1) {
const newSlides = JSON.parse(dataRes.data.data.TempData)
slidesStore.setSlides(newSlides)
queryObj.value.TempId = dataRes.data.data.TempId
queryObj.value.LineId = dataRes.data.data.LineId
queryObj.value.LineName = dataRes.data.data.LineName
queryObj.value.LtId = dataRes.data.data.LtId
queryObj.value.Title = dataRes.data.data.Title
queryObj.value.TempData = dataRes.data.data.TempData
queryObj.value.CoverImg = dataRes.data.data.CoverImg
queryObj.value.CountryName = dataRes.data.data.CountryName
queryObj.value.SeasonName = dataRes.data.data.SeasonName
queryObj.value.ColorName = dataRes.data.data.ColorName
queryObj.value.ColorStr = dataRes.data.data.ColorStr
queryObj.value.TempType = dataRes.data.data.TempType
}
} catch (error) {
console.log("GetTripTemplateSlide", error);
}
}
GetTripTemplate()
// 页面被切换时
const thumbnailsRef = ref<InstanceType<typeof Draggable>>()
watch(() => slideIndex.value, () => {
// 清除多选状态的幻灯片
if (selectedSlidesIndex.value.length) {
mainStore.updateSelectedSlidesIndex([])
......@@ -124,7 +153,11 @@ const getHtmlPlainText = (html_str) => {
return ''
}
}
queryObj.value = inject(injectKeyDataSource).queryObj
let pageObj = slides.value.find((slide,indexs) => {
return slideIndex.value==indexs
})
// pageType.value = pageObj.pageType
// 切换页面
const changeSlideIndex = (index: number) => {
mainStore.setActiveElementIdList([])
......@@ -132,45 +165,36 @@ const changeSlideIndex = (index: number) => {
const newElements = slides.value.find((slide,indexs) => {
return index==indexs
})
datas.DataSource.pageType = newElements.pageType
let TemplateList
if(newElements.pageType==1) TemplateList = datas.DataSource.jc
else if(newElements.pageType==2) TemplateList = datas.DataSource.jd
else if(newElements.pageType==3) TemplateList = datas.DataSource.jq
else if(newElements.pageType==4) TemplateList = datas.DataSource.cs
datas.DataSource.DataSourceList = []
newElements.elements.forEach(slide=>{
if(slide.type!="text"&&slide.type!="image") return
let FiledTypeStr
if(slide.type=="text") FiledTypeStr = getHtmlPlainText(slide.content)
if(slide.type=="image") FiledTypeStr = slide.src
let Obj = {}
if(slide.type=="text"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jc,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
if(slide.FiledTypeStr){
Obj = {
...slide,
}
datas.DataSource.DataSourceList.push(Obj)
}
if(slide.type=="image"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jd,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}else{
Obj = {
...slide,
FiledTypeStr: FiledTypeStr,
TemplateList: TemplateList,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}
if(Obj){
datas.DataSource.DataSourceList.push(Obj)
}
})
......
src/views/Editor/Toolbar/ElementTemplateData.vue
View file @ 136f445f
......@@ -4,6 +4,18 @@
<div class="row">
<Button style="flex: 1;" @click="AllDataSource()">数据源</Button>
</div>
<p class="q-mt-md"><span class="Required q-mr-md">*</span>页面类型：</p>
<div class="row wrap q-mt-md">
<el-select v-model="datas.DataSource.pageType" class="m-2"
placeholder="请页面类型">
<el-option
v-for="item in pageTypesList"
:key="item.key"
:label="item.label"
:value="item.key"
/>
</el-select>
</div>
<p class="q-mt-md"><span class="Required q-mr-md">*</span>模版名称：</p>
<div class="row wrap q-mt-md">
<el-input v-model="queryObj.Title" placeholder="输入模板名称" class="input-with-select"></el-input>
......@@ -31,9 +43,6 @@
:value="item.LineID"
/>
</el-select>
<!-- <el-check-tag :checked="queryObj.LineId == x.LineID"
@change="onLineChangeHandler(x)"
class="text-small q-mr-md" v-for="x in lines" :key="x.LineID">{{x.LineName}}</el-check-tag> -->
</div>
<template v-if="Series.length>0">
<p class="q-mt-md"><span class="Required q-mr-md">*</span>选择系列：</p>
......@@ -95,62 +104,81 @@
const lines = ref([] as Array < any > ) //线路
const Series = ref([] as Array < any > ) //系列
const pageTypesList = ref([
{ label: '基础', key: 1 },
{ label: '酒店', key: 2 },
{ label: '景', key: 3 },
{ label: '餐', key: 4 },
])
const slidesStore = useSlidesStore()
const { slides, slideIndex } = storeToRefs(slidesStore)
const setCountryValue = () =>{
let obj = dispositionObj.value.ColorList.filter(x=>{
return x.ColorValue == queryObj.ColorStr
let obj = dispositionObj.value.ColorList.find(x=>{
return x.ColorValue == queryObj.value.ColorStr
})
queryObj.value.ColorName = obj.ColorName
}
//提取字符串中的文字
const getHtmlPlainText = (html_str) => {
let re = new RegExp('<[^<>]+>', 'g')
if (html_str) {
let text = html_str.replace(re, '')
return text
} else {
return ''
}
}
let pageObj = slides.value.find((slide,indexs) => {
return slideIndex.value==indexs
})
watch(() => datas.DataSource.pageType, () => {
const newSlides = slides.value
newSlides.forEach((slide,indexs)=>{
if(slideIndex.value==indexs){
slide.pageType = datas.DataSource.pageType
}
})
slidesStore.setSlides(newSlides)
})
// 所有数据源
const AllDataSource = () => {
datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
// 绑定数据源
const newElements = slides.value.find((slide,indexs) => {
return slideIndex.value==indexs
})
datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
let TemplateList
if(newElements.pageType==1) TemplateList = datas.DataSource.jc
else if(newElements.pageType==2) TemplateList = datas.DataSource.jd
else if(newElements.pageType==3) TemplateList = datas.DataSource.jq
else if(newElements.pageType==4) TemplateList = datas.DataSource.cs
datas.DataSource.DataSourceList = []
newElements.elements.forEach(slide=>{
if(slide.type!="text"&&slide.type!="image") return
let FiledTypeStr
if(slide.type=="text") FiledTypeStr = getHtmlPlainText(slide.content)
if(slide.type=="image") FiledTypeStr = slide.src
let Obj = {}
if(slide.type=="text"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jc,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
...slide,
FiledTypeStr: FiledTypeStr,
TemplateList: TemplateList,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}
datas.DataSource.DataSourceList.push(Obj)
}
if(slide.type=="image"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jd,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}
datas.DataSource.DataSourceList.push(Obj)
}
})
}
......@@ -173,7 +201,7 @@
* 获取系列列表
*/
const onLineChangeHandler = async () =>{
let obj = Series.value.filter(x=>{
let obj = lines.value.find(x=>{
return x.LineID == queryObj.value.LineId
})
queryObj.value.LtId = null
......
src/views/Editor/Toolbar/SlideDesignPanel.vue
View file @ 136f445f
......@@ -99,10 +99,6 @@
<div class="row">
<Button style="flex: 1;" @click="applyBackgroundAllSlide()">应用背景到全部</Button>
</div>
<!-- <div class="row">
<Button style="flex: 1;" @click="AllDataSource()">数据源</Button>
</div> -->
<Divider />
......@@ -355,68 +351,6 @@ const {
applyThemeToAllSlides,
} = useSlideTheme()
//提取字符串中的文字
const getHtmlPlainText = (html_str) => {
let re = new RegExp('<[^<>]+>', 'g')
if (html_str) {
let text = html_str.replace(re, '')
return text
} else {
return ''
}
}
// 所有数据源
const AllDataSource = () => {
datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
// 绑定数据源
const newElements = slides.value.find((slide,indexs) => {
return slideIndex.value==indexs
})
datas.DataSource.DataSourceList = []
newElements.elements.forEach(slide=>{
let Obj = {}
if(slide.type=="text"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jc,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}
datas.DataSource.DataSourceList.push(Obj)
}
if(slide.type=="image"){
if(slide.FiledTypeStr){
Obj = {
...slide,
}
}else{
Obj = {
...slide,
FiledTypeStr: getHtmlPlainText(slide.content),
TemplateList: datas.DataSource.jd,
TemplateDataSource: {
Content: '',
Name: '',
Id: null as Number
},
}
}
datas.DataSource.DataSourceList.push(Obj)
}
})
}
// 设置背景模式：纯色、图片、渐变色
const updateBackgroundType = (type: 'solid' | 'image' | 'gradient') => {
if (type === 'solid') {
......
src/views/Editor/index.vue
View file @ 136f445f
......@@ -53,6 +53,7 @@ import ConfigService from '@/services/ConfigService'
const datas = reactive({
DataSource:{
pageType: 1,
DataSourceOverlay: false,
DataSourceList:[],
TemplateDataSource:[],
......@@ -61,8 +62,9 @@ const datas = reactive({
jq:[],//景区
cs:[],//餐食
queryObj:{
TempId: 0,//编号(新增传0) 是 [int]
TempId: 10,//编号(新增传0) 是 [int]
LineId: null,//线路Id 是 [int]
LineName: '',//线路名称 是 [string]
LtId: null,//系列Id 是 [int]
Title: '',//名称 是 [string]
TempData: null,//模板数据 是 [json]
......@@ -71,46 +73,19 @@ const datas = reactive({
SeasonName: '',//季节 是 [string]
ColorName: '',//颜色名称 是 [string]
ColorStr: null,//颜色值 是 [string]
LineName: '',//线路名称 是 [string]
TempType: 1,// 版面类型(1-横版，2-竖版)
}
},
})
const queryObj = reactive({
TempId: 0,
})
const slidesStore = useSlidesStore()
const { slides, slideIndex } = storeToRefs(slidesStore)
// 获取行程模版数据
const GetTripTemplate = async () =>{
try {
let queryObj = {
TempId: datas.DataSource.queryObj.TempId
}
let TemplateRes = await ConfigService.GetTripTemplateSlide(queryObj);
if (TemplateRes.data.resultCode == 1) {
datas.DataSource.TemplateDataSource = TemplateRes.data.data
datas.DataSource.jc = datas.DataSource.TemplateDataSource.filter(x => {
return x.FiledType==1
})
datas.DataSource.jd = datas.DataSource.TemplateDataSource.filter(x => {
return x.FiledType==2
})
datas.DataSource.jq = datas.DataSource.TemplateDataSource.filter(x => {
return x.FiledType==3
})
datas.DataSource.cs = datas.DataSource.TemplateDataSource.filter(x => {
return x.FiledType==4
})
}
} catch (error) {
console.log("TemplateGetTripFiled", error);
}
}
watch(() => datas.DataSource, () => {
provide(injectKeyDataSource,datas.DataSource)
})
// 数据源
const GetTripFiled = async () =>{
try {
......
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