Commit ee767eee authored by zhengke's avatar zhengke

生成封面调整、数据源非必选调整,数据源可清空

parent eafb1e8b
...@@ -94,7 +94,7 @@ ...@@ -94,7 +94,7 @@
<LinkDialog @close="linkDialogVisible = false" /> <LinkDialog @close="linkDialogVisible = false" />
</Modal> </Modal>
</div> </div>
<div style="position: relative;z-index: -1;"> <div style="position: relative;z-index: -1;" v-if="!model&&ConfigId&&slides.length>0">
<div class="export-img-dialog"> <div class="export-img-dialog">
<div class="thumbnails-view"> <div class="thumbnails-view">
<div class="thumbnails" v-for="slide in slides" ref="FeatureImgRef"> <div class="thumbnails" v-for="slide in slides" ref="FeatureImgRef">
...@@ -193,11 +193,13 @@ const FeatureImgRef = ref(null) ...@@ -193,11 +193,13 @@ const FeatureImgRef = ref(null)
// 将界面生成形成图 // 将界面生成形成图
watch(() => slides.value, (n,o) =>{ watch(() => slides.value, (n,o) =>{
FeatureImgStore.setFeatureImg([]) FeatureImgStore.setFeatureImg([])
setTimeout(()=>{ if(FeatureImgRef.value&&FeatureImgRef.value.length>0){
for(let i=0;i<FeatureImgRef.value.length;i++){ setTimeout(()=>{
exportFeatureImg(FeatureImgRef.value[i], 'jpeg', 1, true,i+1) for(let i=0;i<FeatureImgRef.value.length;i++){
} exportFeatureImg(FeatureImgRef.value[i], 'jpeg', 1, true,i+1)
},500) }
},500)
}
}) })
// 监听请求保存成功 重新请求数据 // 监听请求保存成功 重新请求数据
watch(() => FeatureImgRef.value, (n,o) =>{ watch(() => FeatureImgRef.value, (n,o) =>{
......
...@@ -29,7 +29,8 @@ ...@@ -29,7 +29,8 @@
width="170"> width="170">
<template #default="scope"> <template #default="scope">
<div class="DataaSourceR" v-if="scope.row.TemplateList"> <div class="DataaSourceR" v-if="scope.row.TemplateList">
<el-select v-model="scope.row.TemplateDataSource.Id" class="m-2" <el-select v-model="scope.row.TemplateDataSource.Id"
clearable class="m-2"
placeholder="请绑定数据源" placeholder="请绑定数据源"
@change="setTemplateDataSource(scope.row.TemplateDataSource.Id,scope.$index)"> @change="setTemplateDataSource(scope.row.TemplateDataSource.Id,scope.$index)">
<!-- :disabled="scope.row.type=='image'&&item.Name.indexOf('图')==-1" --> <!-- :disabled="scope.row.type=='image'&&item.Name.indexOf('图')==-1" -->
...@@ -57,12 +58,20 @@ ...@@ -57,12 +58,20 @@
const datas = reactive({ const datas = reactive({
DataSource:{}, DataSource:{},
loading: false,//是否更新数据源
}) })
datas.DataSource = inject(injectKeyDataSource) datas.DataSource = inject(injectKeyDataSource)
const slidesStore = useSlidesStore() const slidesStore = useSlidesStore()
const { slides, slideIndex } = storeToRefs(slidesStore) const { slides, slideIndex } = storeToRefs(slidesStore)
watch(() => datas.DataSource.DataSourceOverlay, (n,o) => {
if(n){
datas.loading= false
}
if(!n&&datas.loading){
setNewDatas()
}
})
const setType = (x) =>{ const setType = (x) =>{
if(x.type=="image"){ if(x.type=="image"){
return x.TemplateList.filter(item=>{ return item.Name.indexOf('图')!=-1}) return x.TemplateList.filter(item=>{ return item.Name.indexOf('图')!=-1})
...@@ -101,21 +110,26 @@ ...@@ -101,21 +110,26 @@
} }
// 数据源关键数据赋值 // 数据源关键数据赋值
const setTemplateDataSource = (Id,index) => { const setTemplateDataSource = (Id,index) => {
datas.loading = true
datas.DataSource.DataSourceList.forEach((x,indexs)=>{ datas.DataSource.DataSourceList.forEach((x,indexs)=>{
if(index==indexs){ if(index==indexs){
let obj = x.TemplateList.find(y=>{ let obj = x.TemplateList.find(y=>{
return y.Id==x.TemplateDataSource.Id return y.Id==x.TemplateDataSource.Id
}) })
x.TemplateDataSource.Content = obj.Content if(obj){
x.TemplateDataSource.Name = obj.Name x.TemplateDataSource.Content = obj.Content
x.TemplateDataSource.Name = obj.Name
}else{
x.TemplateDataSource.Content = ''
x.TemplateDataSource.Name = ''
}
// if(x.type=="text"){ // if(x.type=="text"){
// x.FiledTypeStr = obj.Name // x.FiledTypeStr = obj.Name
// x.content = x.content.replace(getHtmlPlainText(x.content),obj.Name) // x.content = x.content.replace(getHtmlPlainText(x.content),obj.Name)
// } // }
} }
}) })
setNewDatas()
} }
const OffDataSource = () =>{ const OffDataSource = () =>{
......
...@@ -350,10 +350,10 @@ const setTemplate = async () =>{ ...@@ -350,10 +350,10 @@ const setTemplate = async () =>{
type: 'warning', type: 'warning',
}) })
} }
if(queryObj.value.Title==''||!queryObj.value.LineId||!queryObj.value.LtId if(queryObj.value.Title==''||!queryObj.value.LineId||queryObj.value.LineName==''
||queryObj.value.CoverImg=='' ||queryObj.value.CoverImg==''
||queryObj.value.CountryName==''||queryObj.value.SeasonName=='' ||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
||queryObj.value.ColorName==''||queryObj.value.ColorStr==''||queryObj.value.LineName==''){ ){
mainStore.setToolbarState(ToolbarStates.EL_TEMPLATEDATA) mainStore.setToolbarState(ToolbarStates.EL_TEMPLATEDATA)
return ElMessage({ return ElMessage({
showClose: true, showClose: true,
......
...@@ -175,7 +175,6 @@ const GetTripFiledData = async () =>{ ...@@ -175,7 +175,6 @@ const GetTripFiledData = async () =>{
let dataPath = y.TemplateDataSource.Content.split('.') let dataPath = y.TemplateDataSource.Content.split('.')
let value=JSON.parse(JSON.stringify(travel)); let value=JSON.parse(JSON.stringify(travel));
dataPath.forEach((oo,i)=>{ dataPath.forEach((oo,i)=>{
if(value && value[oo]){ if(value && value[oo]){
if(i==0 && Array.isArray(value[oo])){ if(i==0 && Array.isArray(value[oo])){
let temp = cursors.find(item=>item.key==oo) let temp = cursors.find(item=>item.key==oo)
...@@ -270,11 +269,8 @@ const GetTripTemplate = async () =>{ ...@@ -270,11 +269,8 @@ const GetTripTemplate = async () =>{
queryObj.value.ColorStr = dataRes.data.data.ColorStr queryObj.value.ColorStr = dataRes.data.data.ColorStr
queryObj.value.TempType = dataRes.data.data.TempType queryObj.value.TempType = dataRes.data.data.TempType
slidesStore.updateSlideIndex(0) slidesStore.updateSlideIndex(0)
if(TempId.value&&!searchData.value.TempId) await GetTripConfig()
if(ConfigId.value==0||TempId.value) { if(ConfigId.value==0) return
if(TempId.value) await GetTripConfig()
return
}
await GetTripFiledData() await GetTripFiledData()
} }
} catch (error) { } catch (error) {
......
<template> <template>
<div class="q-mt-xs bg-white q-pa-xs rounded ElementTemplateData"> <div class="q-mt-xs bg-white q-pa-xs rounded ElementTemplateData">
<div class="column text-mdall"> <div class="column text-mdall">
<div class="column"> <div class="column">
...@@ -64,7 +65,7 @@ ...@@ -64,7 +65,7 @@
</el-select> </el-select>
</div> </div>
<template v-if="Series.length>0"> <template v-if="Series.length>0">
<p class="q-mt-md"><span class="Required q-mr-md">*</span>选择系列:</p> <p class="q-mt-md"><span class="Required q-mr-md"></span>选择系列:</p>
<div class="row wrap q-mt-md"> <div class="row wrap q-mt-md">
<el-select v-model="queryObj.LtId" class="m-2" <el-select v-model="queryObj.LtId" class="m-2"
filterable placeholder="请选择系列"> filterable placeholder="请选择系列">
...@@ -101,7 +102,7 @@ ...@@ -101,7 +102,7 @@
+ 添加标签 + 添加标签
</el-button> </el-button>
</div> </div>
<p class="q-mt-md"><span class="Required q-mr-md">*</span>选择颜色:</p> <p class="q-mt-md"><span class="Required q-mr-md"></span>选择颜色:</p>
<div class="row wrap q-mt-md"> <div class="row wrap q-mt-md">
<el-select v-model="queryObj.ColorStr" class="m-2" placeholder="请选择颜色" <el-select v-model="queryObj.ColorStr" class="m-2" placeholder="请选择颜色"
@change="setCountryValue"> @change="setCountryValue">
...@@ -126,6 +127,22 @@ ...@@ -126,6 +127,22 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 生成封面图 -->
<div style="opacity: 0;position: absolute;left: 100px;" v-if="model&&slides">
<div class="export-img-dialog">
<div class="thumbnails-view">
<div class="thumbnails" ref="FeatureImgRef">
<ThumbnailSlide
class="thumbnail"
:key="slides[slideIndex].id"
:slide="slides[slideIndex]"
:size="1600"
/>
</div>
</div>
</div>
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
...@@ -138,6 +155,8 @@ ...@@ -138,6 +155,8 @@
import ConfigService from '@/services/ConfigService' import ConfigService from '@/services/ConfigService'
import { injectKeyDataSource } from '@/types/injectKey' import { injectKeyDataSource } from '@/types/injectKey'
import { getHtmlPlainText } from '@/utils/common' import { getHtmlPlainText } from '@/utils/common'
import useExport from '@/hooks/useExport'
import ThumbnailSlide from '@/views/components/ThumbnailSlide/index.vue'
const datas = reactive({ const datas = reactive({
DataSource:{}, DataSource:{},
...@@ -164,11 +183,14 @@ ...@@ -164,11 +183,14 @@
const { slides, slideIndex } = storeToRefs(slidesStore) const { slides, slideIndex } = storeToRefs(slidesStore)
const isCoverImgStore = useScreenStore() const isCoverImgStore = useScreenStore()
const { TemplateDataSource, TemplateType, CoverImg, isCoverImg } = storeToRefs(useScreenStore()) const { model, ConfigId, TemplateDataSource, TemplateType, CoverImg, isCoverImg } = storeToRefs(useScreenStore())
const mainStore = useMainStore() const mainStore = useMainStore()
const mainMenuVisible = ref(false) const mainMenuVisible = ref(false)
const FeatureImgRef = ref(null)
const { exportImage } = useExport()
watch(() => datas.DataSource.pageType, () => { watch(() => datas.DataSource.pageType, () => {
const newSlides = slides.value const newSlides = slides.value
newSlides.forEach((slide,indexs)=>{ newSlides.forEach((slide,indexs)=>{
...@@ -201,9 +223,10 @@ ...@@ -201,9 +223,10 @@
} }
const setDialogForExport = (type: DialogForExportTypes) => { const setDialogForExport = (type: DialogForExportTypes) => {
mainStore.setDialogForExport(type) // mainStore.setDialogForExport(type)
mainMenuVisible.value = false mainMenuVisible.value = false
isCoverImgStore.setIsCoverImg(true) isCoverImgStore.setIsCoverImg(true)
exportImage(FeatureImgRef.value, 'png', 1, true)
} }
const setCountryValue = () =>{ const setCountryValue = () =>{
......
...@@ -71,15 +71,15 @@ ...@@ -71,15 +71,15 @@
<div class="MarketIndexListBox"> <div class="MarketIndexListBox">
<div class="MarketIndexList bg-white rounded"> <div class="MarketIndexList bg-white rounded">
<div class="MarketIndexList-Hover"> <div class="MarketIndexList-Hover">
<div class="q-mr-lg"> <div>
<el-button type="primary" v-tooltip="'详情'" <el-button type="primary"
icon="Tickets" circle style="color: #ffff;" style="color: #ffff;"
@click="getTemplate(item)"></el-button> @click="getTemplate(item)">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;详情&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</el-button>
</div> </div>
<div class="q-ml-lg"> <div class="q-mt-lg">
<el-button type="primary" v-tooltip="'选择该模版'" <el-button type="primary"
icon="Pointer" circle style="color: #ffff;" style="color: #ffff;"
@click="goToTemplate(item)"></el-button> @click="goToTemplate(item)">选择该模版</el-button>
</div> </div>
</div> </div>
<div class="MarketIndexList-img"> <div class="MarketIndexList-img">
...@@ -383,6 +383,7 @@ ...@@ -383,6 +383,7 @@
-ms-transition: opacity 2s ease; -ms-transition: opacity 2s ease;
-o-transition: opacity 2s ease; -o-transition: opacity 2s ease;
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
color: $themeHoverColor; color: $themeHoverColor;
......
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