Commit 7a758eb5 authored by zhengke's avatar zhengke

src/components/User/UserCard.vue

parents f97a454e 33ebc45a
<template>
<div class="q-px-md q-pt-lg column full-height" ref="currentRootDom">
<div class="q-pl-lg row q-mb-lg">
<div class="column full-height" ref="currentRootDom">
<!-- <div class="q-pl-lg row q-mb-lg">
<div class="col row items-center q-pl-md">
<h5 class="row items-center">
<span class="q-pl-md">
......@@ -17,7 +17,7 @@
</el-icon>
</div>
</div>
</div>
</div> -->
<div class="col full-width full-height q-ml-md">
<div class="CloudDisk-form row full-height">
<div class="CloudDisk-L">
......@@ -30,10 +30,10 @@
</div>
<div class="CloudDisk-L-Center fz14" v-loading="loadingGroup">
<div class="CloudDisk-L-Title row flex-between cusor-pointer"
v-for="(item,index) in GroupList" :key="index"
v-for="(item,index) in GroupList"
:class="[queryObj.CloudGroupId==item.Id?'active':'']">
<span class="block" @click="refreshHandler(item)">{{item.GName}}</span>
<div class="row">
<div class="row" :key="index">
<template v-if="item.Id">
<el-dropdown class="q-pl-lg CloudDisk-L-TitleR" trigger="click">
<div class="CloudDisk-L-Title-M row items-center flex-center">
......@@ -61,11 +61,21 @@
</div>
<div class="CloudDisk-R grow">
<div class="row flex-center CloudDisk-R-inquire">
<el-input v-model="queryObj.FileName" placeholder="请输入图片名称搜索" clearable @keyup.enter="refreshHandler"
<!-- <el-input v-model="queryObj.FileName" placeholder="请输入图片名称搜索" clearable @keyup.enter="refreshHandler"
@input="SearchImg">
<template #append>
<el-button type="primary" style="color: white;" @click="refreshHandler">搜索</el-button>
</template>
</el-input> -->
<el-input style="max-width:600px" v-model="queryObj.FileName" placeholder="请输入图片名称搜索" class="q-pr-33" clearable
@keyup.enter="refreshHandler" @input="SearchImg">
<template #append>
<div class="Market-select-line absolute"></div>
<div class="row items-center pointer">
<img src="../../assets/img/home-search.png" width="21" height="21"
@click="refreshHandler"/>
</div>
</template>
</el-input>
</div>
<div ref="imgDiskRef" class="full-height" style="padding-top: 10px; overflow: auto;"
......@@ -84,7 +94,7 @@
<template v-for="(item,index) in dataList">
<el-dropdown trigger="click">
<div class="CloudDisk-R-Box cursor-pointer">
<div class="CloudDisk-R-Box cursor-pointer" :key="index">
<div class="CloudDisk-R-Img">
<el-image :src="item.FilePath" style="width: 100%; height: 100%;"
fit="cover"/>
......@@ -126,6 +136,7 @@
<el-dropdown-item icon="CopyDocument" @click="CopyTo(item)">复制到</el-dropdown-item>
<el-dropdown-item icon="Expand" @click="MoveFile(item)">移动到</el-dropdown-item>
<el-dropdown-item icon="Delete" @click="deleteImg(item)">删除</el-dropdown-item>
<el-dropdown-item icon="View" @click="getImg(item,index)">查看</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
......@@ -169,10 +180,17 @@
:GroupList="GroupAll"
@close="close"
@success="close(),dialogCMVisible=false,SearchGroup(),refreshHandler()"></copyMove>
<el-image-viewer
@close="() => { isViewerShow = false }"
v-if="isViewerShow"
:initial-index="currentImg"
:url-list="srcList"></el-image-viewer>
</template>
<script setup lang="ts">
import { ref, reactive, watch, inject, onMounted, PropType } from "vue";
import { ElMessage } from "element-plus";
import { ref, reactive, watch, inject, onMounted, PropType, nextTick } from "vue";
import { ElMessage,ElImage } from "element-plus";
import { ArrowLeft,CopyDocument } from "@element-plus/icons-vue";
import CloudDiskService from "@/services/CloudDiskService";
import { injectKeyTemplate } from "@/types/injectKey";
......@@ -181,6 +199,15 @@
import NewEditCloudDisk from '@/components/CloudDisk/NewEdit'
import copyMove from '@/components/CloudDisk/copyMove'
import { noDataImg } from "@/utils/common";
import { useRouter } from "vue-router";
const router = useRouter()
const currentRoute = router.currentRoute.value
const parmas = ref({} as any)
parmas.value = currentRoute.params
const props = defineProps({
isPersonage: '' as any,
})
const RefreshLoading = ref(false)
const queryObj = reactive({
pageIndex: 1,
......@@ -189,6 +216,8 @@
FileName: '',
total: 0
})
console.log(parmas.value,'----')
if(props.isPersonage) queryObj.CloudGroupId = parmas.value.id
const loading = ref(false as any)
const dataList = ref([] as Array<any>);
const currentRootDom = ref()
......@@ -209,6 +238,15 @@
const GroupId = ref(''|Number)
const dialogCMVisible = ref(false)
const editLoading = ref(false)
const currentImg = ref(-1)
const srcList = ref([] as Array<any>)
const isViewerShow = ref(false);
const getImg = (item:any,index:Number) => {
currentImg.value = index
isViewerShow.value = true
}
const CopyTo = (row:any) =>{
addEditMsg.Id = row.DetailsId
......@@ -396,7 +434,9 @@ const querySearchGroup = async () =>{
if(loadingGroup.value) return
loadingGroup.value = true
try {
let datasRes = await CloudDiskService.GetPPTCloudLists(GName.value);
let datasRes
if(props.isPersonage) datasRes = await CloudDiskService.GetPPTCloudList(GName.value);
else datasRes = await CloudDiskService.GetPPTCloudLists(GName.value);
if (datasRes.data.resultCode==ApiResult.SUCCESS) {
GroupList.value = datasRes.data.data.list
GroupList.value.unshift({
......@@ -428,7 +468,9 @@ const SearchImg = () =>{
loading.value = true;
try {
if (queryObj.pageIndex == 1) dataList.value = [];
let pageRes = await CloudDiskService.GetPPTCloudInfoPages(queryObj);
let pageRes
if(props.isPersonage) pageRes = await CloudDiskService.GetPPTCloudInfoPage(queryObj);
else pageRes = await CloudDiskService.GetPPTCloudInfoPages(queryObj);
if (pageRes.data.resultCode==ApiResult.SUCCESS) {
let arrList = function (list) {
list.forEach((x) => {
......@@ -436,7 +478,9 @@ const SearchImg = () =>{
});
};
arrList(pageRes.data.data.pageData);
let imgs = pageRes.data.data.pageData.map(x=> x.FilePath)
dataList.value = dataList.value.concat(pageRes.data.data.pageData);
srcList.value = srcList.value.concat(imgs);
queryObj.pageCount = pageRes.data.data.pageCount;
}
loading.value = false;
......
......@@ -93,10 +93,10 @@
}
const setCopy = async () =>{
setLoading.value = true
let pageRes;
if(props.dialogType==1) pageRes = await CloudDiskService.CloudFileCopy(params);
else pageRes = await CloudDiskService.CloudFileMove(params);
if (pageRes.data.resultCode==ApiResult.SUCCESS) {
let response;
if(props.dialogType==1) response = await CloudDiskService.CloudFileCopy(params);
else response = await CloudDiskService.CloudFileMove(params);
if (response.data.resultCode==ApiResult.SUCCESS) {
dialogFormVisible.value = false
emit('success')
}
......
<template>
<el-dialog v-model="dialogFormVisible"
:show-close="false"
:title="dialogTitle"
:close-on-press-escape="false" :close-on-click-modal="false"
:width="width+40+'px'">
<div
class="PictureComparison"
:style="'width:' + width + 'px;height:' + height + 'px'">
<div class="before-image" :style="'width:' + data.x + 'px'" @click.stop="goLeft">
<div :style="'width:' + width + 'px;height:' + height + 'px'">
<slot name="left"></slot>
</div>
</div>
<div class="after-image" @click.stop="goRight">
<div :style="'width:' + width + 'px;height:' + height + 'px'">
<slot name="right"></slot>
</div>
</div>
<div
class="divider-bar"
:style="'left:' + data.x + 'px'"
@mousedown.prevent="onmouseDown($event)"
></div>
<span class="spanHandle" :style="{ left: data.x - 24+'px' }"
@mousedown.prevent="onmouseDown($event)"></span>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="close" :disabled="setLoading">取消</el-button>
<el-button type="primary" @click="submit" :loading="setLoading">
确认替换
</el-button>
</div>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { reactive, ref, onMounted } from "vue";
import { storeToRefs } from 'pinia'
import AliyunUpload from '@/utils/upload/aliyun'
import { useSlidesStore, useMainStore } from '@/store'
const mainStore = useMainStore()
const slidesStore = useSlidesStore()
const { handleElement, handleElementId } = storeToRefs(mainStore)
const dialogFormVisible = ref(true)
const dialogTitle = ref('原图/清晰图对比')
const setLoading = ref(false)
const props = defineProps({
width: { type: String, default: "500" },
height: { type: String, default: "300" },
newImg: { type: String, default: "" }
})
const data = reactive({
isDown: false, //鼠标是否正按住
moveX: 0, //鼠标移动的位置
x: props.width / 2, //设置位置
})
const upperImg = 'data:image/png;base64,'+props.newImg; // 上层图
const emit = defineEmits<{
(event: 'close'): void,
(event: 'success'): void,
}>()
const onmouseDown = (event) => {
data.isDown = true;
data.x = event.target.offsetLeft;
var disX = event.clientX - event.target.offsetLeft;
document.onmousemove = function (event) {
if (data.isDown == false) {
return;
}
data.x = event.clientX - disX;
if (data.x >= props.width) {
data.x = props.width;
} else if (data.x <= 0) {
data.x = 0;
}
};
document.onmouseup = function () {
data.isDown = false;
document.onmousemove = document.onmouseup = null;
return false;
};
}
const goLeft = () => {
data.x = 0;
}
const goRight = () => {
data.x = props.width;
}
const close = () =>{
dialogFormVisible.value = false
emit('close')
}
const submit = () => {
let text = '此操作将替换原图,请谨慎处理!'
ElMessageBox.confirm(
`${text}`,
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
setImg()
}).catch(() => {})
}
const setImg = async () =>{
setLoading.value = true
let name = new Date().getTime()+".png"
const file = dataURLtoFile(upperImg, name)
let url = await AliyunUpload.UploadAsync(file,`pptist/desgin/${name}`)
if(url != ''){
const props = { src: url }
slidesStore.updateElement({
id: handleElementId.value,
props
})
emit('success')
}
setLoading.value = false
}
const dataURLtoFile = (dataurl:string, filename:string) => {
let arr = dataurl.split(",")
let mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, { type: mime });
}
</script>
<style scoped>
.PictureComparison {
position: relative;
display: inline-block;
margin: 0 auto;
min-height: 273px;
overflow: hidden;
}
.before-image {
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 50%;
overflow: hidden;
}
.after-image {
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.divider-bar {
cursor: move;
position: absolute;
width: 1px;
left: 40%;
top: 0;
bottom: 0px;
background: white;
height: 100%;
display: block;
z-index: 2;
/* box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.4); */
}
.divider-bar::after {
/* content: "<->";
position: absolute;
color: #000;
font-weight: bold;
text-align: center;
line-height: 32px;
width: 50px;
height: 30px;
background: #fff;
border-radius: 15px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); */
}
.spanHandle {
cursor: move;
position: absolute; /*决定定位还是一样的*/
z-index: 2; /* 样式很多,都不是关键的,只有这里,需要注意层次要低于inputRange*/
height: 48px;
width: 48px;
position: center;
font-size: 24px;
border: 1px;
border-radius: 50%;
top: calc(50% - 24px);
background-color: rgb(255, 255, 255, 0.5);
}
.spanHandle:before {
left: 5px;
transform: rotate(-45deg);
}
.spanHandle:after {
right: -5px;
transform: rotate(135deg);
}
.spanHandle:after,
.spanHandle:before {
border-left: 2px solid;
border-top: 2px solid;
content: "";
height: 10px;
position: absolute;
top: 50%;
transform-origin: 0 0;
width: 10px;
}
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<div class="items-center row" ref="UserCardRef">
<div class="items-center row">
<div class="primary-link-button q-mr-lg cusor-pointer no-select" v-if="parmas.path=='/m'"
@click="goDesNorm" style="color: #448026 !important;background: #ecf2e9;">模板设计规范</div>
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1713433759000_282.png"
style="height: 33px" @click="forwardProduct" class="cusor-pointer"/>
<div class="primary-link-button q-ml-lg cusor-pointer no-select" @click="addVisible=true">创建设计</div>
......@@ -85,7 +87,7 @@
/></el-icon>
<template #dropdown>
<div class="MarketPopoverMore row wrap pointer">
<div class="column" v-for="(item, index) in moreList" @click="forward(item)">
<div class="column" v-for="(item, index) in moreList" @click="forward(item.Url)">
<div>
<img :src="item.icon" width="34" height="34" />
</div>
......@@ -98,7 +100,6 @@
<!-- 创建设计 -->
<temDesign :addTem="addVisible" @close="addVisible=false"/>
<OrderReview v-if="orderVisible" :show-person="isShowPerson" :default-type="isShowPerson?1:2" @close="()=>orderVisible=false"></OrderReview>
<follow v-if="followVisible" @close="followVisible=false"></follow>
</template>
<script lang="ts" setup>
import { ref } from "vue";
......@@ -130,36 +131,35 @@ const enTheme = ENT_USER_THEME
const fr = userInfo.value.it?EntMemberRight:(userInfo.value.iv?PersonMemberRight:FreeMemberRight)
const isShowPerson = ref(true)
const sampleData = ref<any[]>([0,0,0])
const currentRoute = router.currentRoute.value
const parmas = ref({} as any)
parmas.value = currentRoute
const format = (percentage: number) => {
return percentage == 100 ? '' : ``
}
const moreList = [
{ icon: require("@/assets/img/homeMore0.png"), Name: "添加到桌面",Id:1 },
{ icon: require("@/assets/img/homeMore1.png"), Name: "关注公众号",Id:2 },
{ icon: require("@/assets/img/homeMore2.png"), Name: "我的订单", Url:'/u/order',Id:3 },
{ icon: require("@/assets/img/homeMore3.png"), Name: "意见反馈", Url:'https://work.weixin.qq.com/kfid/kfc378aada578ca8b0e',Id:4 },
{ icon: require("@/assets/img/homeMore0.png"), Name: "添加到桌面" },
{ icon: require("@/assets/img/homeMore1.png"), Name: "关注公众号" },
{ icon: require("@/assets/img/homeMore2.png"), Name: "我的订单", Url:'/u/order' },
{ icon: require("@/assets/img/homeMore3.png"), Name: "意见反馈", Url:'https://work.weixin.qq.com/kfid/kfc378aada578ca8b0e' },
];
const TravelDesign = ref({} as any)
const followVisible = ref(false)
const UserCardRef = ref()
const goDesNorm = () => {
openNewBlank('/d')
}
const forwardUserCenter = ()=>{
router.push('/u')
}
const forward = (item:any)=>{
if(item.Url){
if(item.Url.includes('http://')||item.Url.includes('https://')) openNewBlank(item.Url)
else router.push(item.Url)
}
if(item.Id==2) {
followVisible.value = true
if(UserCardRef.value){
UserCardRef.value.click()
}
const forward = (url:string|undefined)=>{
if(url){
if(url.includes('http://')||url.includes('https://')) openNewBlank(url)
else router.push(url)
}
}
const loginOutHandler = ()=>{
useUser.setUserLoginOut()
......
<template>
<div class="BackTopBox animate__animated animate__fadeInUp">
<div class="BackTopBox animate__animated"
:class="[scrollTop<400?'animate__fadeOutDown':'animate__fadeInUp']">
<img class="cursor-pointer" src="../../assets//img/backtop.png"
style="height: 58px;"
@click="BackTop"/>
......@@ -7,6 +8,12 @@
</template>
<script setup lang="ts">
import { ref, onMounted, reactive } from 'vue'
const props = defineProps({
scrollTop:{
type: Number,
default: 0,
},
})
const emit = defineEmits<{
(event: 'BackTop'): void,
}>()
......
......@@ -27,7 +27,7 @@
:class="[datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==item.Id?'colorF':'color0']">{{item.Name}}</span>
<p class="q-pl-md"
:class="[datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==item.Id?'colorF':'colorBA']">
<span class="q-ml-xs">{{item.width}} * {{item.height}} px</span>
<span class="q-ml-xs" v-if="item.width">{{item.width}} * {{item.height}} px</span>
</p>
</div>
<div v-if="setTemplateType==2&&!item.type" class="row addTemplateBoxRec rounded6 cursor-pointer"
......@@ -36,15 +36,23 @@
:class="[datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==item.Id?'colorF':'color0']">{{item.Name}}</span>
<p class="q-pl-md"
:class="[datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==item.Id?'colorF':'colorBA']">
<span class="q-ml-xs">{{item.width}} * {{item.height}} px</span>
<span class="q-ml-xs" v-if="item.width">{{item.width}} * {{item.height}} px</span>
</p>
</div>
</div>
</div>
</div>
<div class="addTemplateBox fz14" v-if="setTemplateType==2">
<div class="color0 text-left q-pb-lg">自义定尺寸</div>
<div class="addTemplateInput q-mt-xs row items-center">
<div class="color0 text-left q-pb-lg row flex-between">
<span>自义定尺寸</span>
<el-switch
v-model="CustomSwitch"
:active-color="$el-color-primary"
inactive-color="#8790F3"
@change="getDimension">
</el-switch>
</div>
<div v-if="CustomSwitch" class="addTemplateInput q-mt-xs row items-center">
<el-input type="number" min="750" v-model="datas.CustomSize.width"
placeholder="宽" class="input-with-select" @change="setDimension"></el-input>
<span class="q-px-md">*</span>
......@@ -70,7 +78,7 @@ import { useSellTemplateStore,useSlidesStore } from '@/store'
import { useScreenStore } from "@/store/screen";
import { storeToRefs } from "pinia";
import { injectKeyTemplate } from '@/types/injectKey'
import { createOpEditorLink, createSaleCreateLink, managerTemplateLink } from '@/utils/common'
import { createOpEditorLink, createSaleCreateLink, managerTemplateLink, openNewBlank } from '@/utils/common'
import { ElLoading, ElMessage, ElMessageBox } from "element-plus";
import { useRouter } from "vue-router";
import UserCard from "@/components/User/UserCard.vue";
......@@ -78,8 +86,6 @@ import { Delete,View } from '@element-plus/icons-vue';
import { VIEWPORT_SIZE, VIEWPORT_VER_SIZE } from '@/configs/canvas'
import foote from '@/components/footer/index.vue';
import { noDataImg } from "@/utils/common";
const {
userInfo
} = storeToRefs(useUserStore())
......@@ -93,9 +99,11 @@ const layouts = ref([
])
const marketRef = ref<any>()
const RecommendedSizes = ref([
{Name: '使用模板创建(推荐)',width:'',height:'',Id:7,checked:false},
{Name: '手机海报',width:750,height:1334,Id:1,checked:false},
{Name: '小红书配图',width:1242,height:1660,Id:2,checked:false},
{Name: '公众号首图',width:900,height:383,Id:3,checked:false},
{Name: '使用模板创建(推荐)',width:'',height:'',Id:6,checked:false,type:1},
{Name: 'PPT(16:9)',width:1754,height:1240,Id:4,checked:false,type:1},
{Name: 'PPT(9:16)',width:1240,height:1754,Id:5,checked:false,type:1},
])
......@@ -163,6 +171,20 @@ const emit = defineEmits<{
(event:'OK'): void,
}>()
const CustomSwitch = ref(false)
const getDimension = () => {
const Dimension = localStorage.getItem('LastSize')
const LastSize = Dimension?JSON.parse(Dimension):null
if(CustomSwitch.value) {
if(LastSize){
datas.CustomSize.width = LastSize.width
datas.CustomSize.height = LastSize.height
}else Recommended(RecommendedSizes.value[1])
setDimension()
}
}
const close = () => {
emit('close')
}
......@@ -174,6 +196,10 @@ const Recommended = (row:Object) => {
datas.TemplateBoxRec = row
datas.CustomSize.width = null
datas.CustomSize.height = null
if(!row.type) {
if(row.Id!=7) localStorage.setItem('LastSize',JSON.stringify(row))
CustomSwitch.value = false
}
}
const ConfirmCreation = () => {
if(setTemplateType.value==1&&!datas.TemplateBoxRec) {
......@@ -182,22 +208,26 @@ const ConfirmCreation = () => {
message: `请选择推荐尺寸`,
})
}
if(setTemplateType.value==2&&!datas.TemplateBoxRec&&!datas.CustomSize.width&&!datas.CustomSize.height) {
if(setTemplateType.value==1&&datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==6){
return openNewBlank(`/market/create/trip`)
}
if(setTemplateType.value==2&&!datas.TemplateBoxRec&&!CustomSwitch.value) {
return ElMessage.warning({
showClose: true,
message: `请选择推荐尺寸或自定义尺寸`,
})
}
if(setTemplateType.value==2&&!datas.TemplateBoxRec&&
((datas.CustomSize.width&&!datas.CustomSize.height)
||(!datas.CustomSize.width&&datas.CustomSize.height))){
if(!datas.width){
if(setTemplateType.value==2&&datas.TemplateBoxRec&&datas.TemplateBoxRec.Id==7) {
return openNewBlank(`/market/create/ad`)
}
if(setTemplateType.value==2&&CustomSwitch.value&&(!datas.CustomSize.width||!datas.CustomSize.height)){
if(!datas.CustomSize.width){
return ElMessage.warning({
showClose: true,
message: `请输入自定义宽`,
})
}
if(!datas.height){
if(!datas.CustomSize.height){
return ElMessage.warning({
showClose: true,
message: `请输入自定义高`,
......@@ -209,13 +239,12 @@ const ConfirmCreation = () => {
VIEWPORT_SIZE.value = datas.TemplateBoxRec.width
VIEWPORT_VER_SIZE.value = datas.TemplateBoxRec.height
if(datas.TemplateBoxRec.Id==4||datas.TemplateBoxRec.Id==5) {
viewportRatios = datas.TemplateBoxRec.Id==4? 0.7069 : 1.414
slidesStore.setViewportRatio(viewportRatios)
datas.TemplateBoxRec = null
addTemplate(1)
}else {
}else if(datas.TemplateBoxRec.Id==1||datas.TemplateBoxRec.Id==2||datas.TemplateBoxRec.Id==3) {
viewportRatios = datas.TemplateBoxRec.height/datas.TemplateBoxRec.width
slidesStore.setViewportRatio(viewportRatios)
datas.TemplateBoxRec = null
......
......@@ -144,7 +144,8 @@ import {
Pencil,
ToBottom,
PeopleSafe,
StarOne
StarOne,
CloudStorage
} from '@icon-park/vue-next'
export interface Icons {
......@@ -293,7 +294,8 @@ export const icons: Icons = {
IconPencli:Pencil,
IconToBottom:ToBottom,
IconPeopleSafe:PeopleSafe,
IconStarOne:StarOne
IconStarOne:StarOne,
IconCloudStorage:CloudStorage
}
export default {
......
......@@ -228,6 +228,13 @@ const routes: RouteRecordRaw[] = [
title:'水印设置'
}
},
{
path: '/a/c',
component: () => import('@/views/TeamCenter/CloudDiskSpace.vue'),
meta:{
title:'云盘空间'
}
},
{
path: '/a/order',
component: () => import('@/views/TeamCenter/Order.vue'),
......@@ -300,6 +307,13 @@ const routes: RouteRecordRaw[] = [
title:'账户设置'
}
},
{
path: '/u/cloudDiskSpace',
component: () => import('@/views/UserCenter/CloudDiskSpace.vue'),
meta:{
title:'云盘空间'
}
},
]
},
{
......@@ -339,6 +353,22 @@ const routes: RouteRecordRaw[] = [
},
]
},
{
path: '/d',
component: () => import('@/views/DesignSpecification/Layout.vue'),
meta:{
title:'模版设计规范'
},
children:[
{
path: '/d',
component: () => import('@/views/DesignSpecification/Index.vue'),
meta:{
title:'设计规范'
}
},
]
},
{
path: '/p/show',
component: () => import('@/views/Product/Show.vue'),
......
......@@ -3,6 +3,15 @@ import Api,{ HttpResponse, Result } from './../utils/request';
class CloudDiskService{
static async BaiduImageDefinition(params:any):Promise<HttpResponse>{
return Api.Post("ppt_BaiduImageDefinition",params)
}
static async ImgDefinition(DetailsId:any):Promise<HttpResponse>{
let params = { DetailsId }
return Api.Post("ppt_ImgDefinition",params)
}
static async CloudFileCopy(params:any):Promise<HttpResponse>{
return Api.Post("ppt_CloudFileCopy",params)
}
......
......@@ -19,6 +19,7 @@ const menus:{menu:Menu,owner:MenuOwner}[] = [
{menu:{name:'水印设置',icon:'IconTag',url:'/u/w'},owner:'*'},
{menu:{name:'订单/发票',icon:'IconCurrency',url:'/u/order'},owner:'*'},
{menu:{name:'账户设置',icon:'IconProtect',url:'/u/setting'},owner:'*'},
// {menu:{name:'云盘空间',icon:'IconCloudStorage',url:'/u/cloudDiskSpace'},owner:'*'},
{menu:{name:'模版管理',icon:'IconPageTemplate',url:'/m'},owner:'M'},
{menu:{name:'国家',icon:'IconWorld',url:'/m/nation'},owner:'M'},
{menu:{name:'颜色',icon:'IconPlatte',url:'/m/colour'},owner:'M'},
......@@ -27,6 +28,7 @@ const menus:{menu:Menu,owner:MenuOwner}[] = [
{menu:{name:'成员管理',icon:'IconPeoples',url:'/a/u'},owner:'A'},
{menu:{name:'数据统计',icon:'IconDashBoard',url:'/a/d'},owner:'A'},
{menu:{name:'水印设置',icon:'IconTag',url:'/a/w'},owner:'A'},
// {menu:{name:'云盘空间',icon:'IconCloudStorage',url:'/a/c'},owner:'A'},
{menu:{name:'订单/发票',icon:'IconCurrency',url:'/a/order'},owner:'E'},
{
menu:{
......
......@@ -78,6 +78,43 @@ class AliyunUpload {
return ''
}
}
/**
* Base64云盘上传
* filePath:文件保存路径
* parms:{
* isppt: '1',
* uid: token.value,//当前用户Ti肯
* gid: "",//云盘分组Id(没有就不传)
* basestr:"",//图片Base64,
* surl:""https://xx.xx.com/pptist/desgin/1716259237822.png",//原图片路径
* }
*/
static UploadCloudDiskBase64= async ( filePath: string, parms: any) => {
try {
const formData = new FormData();
if(parms&&parms.uid) formData.append('parms', JSON.stringify(parms));
const response = await fetch(`${domainManager().UploadUrl}/Upload/UploadBase64ToALiOSS?filePath=${encodeURIComponent(filePath)}`, {
method: 'POST',
body: formData,
});
if (response.ok) {
let result = await response.text()
let datas = JSON.parse(result)
if(datas.FilePath) return 'https://im.oytour.com' + datas.FilePath
else {
ElMessage.warning({
showClose: true,
message:datas.Message,
})
}
}
return ''
} catch (error) {
return ''
}
}
}
export default AliyunUpload
\ No newline at end of file
<template>
<div class="column">
<template v-for="(item,index) in DesignSpec">
<el-image
style="width: 100vw;"
:src="item">
</el-image>
</template>
</div>
</template>
<script setup lang="ts">
import { reactive, ref } from "vue";
const DesignSpec = reactive([
require("@/assets/img/norm_01.jpg"),
require("@/assets/img/norm_02.jpg"),
require("@/assets/img/norm_03.jpg"),
require("@/assets/img/norm_04.jpg"),
require("@/assets/img/norm_05.jpg"),
require("@/assets/img/norm_06.jpg"),
require("@/assets/img/norm_07.jpg"),
])
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<div class="window-height column">
<div class="user-center-header row items-center">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/pptTD.png"
style="height: 24px" />
<div class="q-ml-lg text-weight-bold" style="font-size: 20px">
模板设计规范
</div>
<div class="col"></div>
<UserCard :size="33"></UserCard>
</div>
<el-scrollbar class="col full-height" wrap-style="overflow-x:unset;">
<router-view />
</el-scrollbar>
</div>
</template>
<script lang="ts" setup>
import { storeToRefs } from 'pinia'
import UserCard from "@/components/User/UserCard.vue";
import { useMenuStore,useScreenStore } from "@/store";
import { ref, watch } from "vue";
import { useRouter } from "vue-router";
import { useUserStore } from "@/store/user"
const router = useRouter()
const useMenu = useMenuStore();
const menus = ref(useMenu.getTemplateMenu);
const { model } = storeToRefs(useScreenStore())
const activeIndex = ref(0)
const userStore= useUserStore()
const userInfo = userStore.getUser
if(!userInfo.isTemplate && !userInfo.iv && !userInfo.ic && !userInfo.ia) router.push('/notfound')
const forwardSpace = () => router.push('/space')
watch(() => router.currentRoute.value.path, (toPath) => {
if(!userInfo.isTemplate && !userInfo.iv && !userInfo.ic && !userInfo.ia) return router.push('/notfound')
menus.value = useMenu.getTemplateMenu
if(!menus.value) return
activeIndex.value = menus.value.findIndex(x=>x.url==router.currentRoute.value.path)
},{immediate: true,deep: true})
</script>
<style scoped>
.user-center-header {
padding: 0 40px 0 28px;
border-bottom: 1px solid #efefef;
height: 56px;
color: #000;
}
.user-center-menu {
width: 232px;
padding: 20px 0 20px 16px;
font-family: microsoft yahei;
}
.user-center-body {
padding: 20px 40px 40px 40px;
}
</style>
<template>
<div class="UploadPicture-from">
<div class="UploadPicture-fromB rounded">
<div class="UploadPicture-fromB rounded"
:class="[winHeight<800?'marginTop':'']">
<div>
<div class="text-title">选择、上传图片</div>
</div>
......@@ -62,7 +63,7 @@
<BuyProduct></BuyProduct>
</div>
</el-tab-pane>
<el-tab-pane label="本地图" name="2">
<el-tab-pane label="我的空间" name="2">
<!-- <FileInput @change="files => insertImageElement(files)">
<div class="upload-box">
<img v-if="imgPath" :src="imgPath" style="height: 200px;"/>
......@@ -166,6 +167,9 @@ const { imgPoolVisible } = storeToRefs(useScreenStore())
const searchData = ref({} as any)
searchData.value = inject(injectKeyTemplate)
const winHeight = ref(0)
winHeight.value = window.innerHeight
watch(() => imgPoolVisible.value, () => {
if(imgPoolVisible.value) showVisible.value = true
})
......@@ -362,6 +366,9 @@ getImgList()
background: #fff;
padding: 20px;
}
.UploadPicture-fromB.marginTop{
margin: 2.5vw auto 0;
}
.col #tippy-30{
z-index: 99999 !important;
}
......
......@@ -247,11 +247,12 @@ const goBack = (type:any) =>{
}else if(model.value==2){
if(type==1) {
searchData.value.SalesEditor = router.currentRoute.value.params
searchData.value.TempId2 = queryObj.value.TempId
if(searchData.value.sellId)searchData.value.TempId2 = queryObj.value.TempId
marketStore.setMarket(true)
SalesBackStore.setSalesBack(1)
searchData.value.TempId = 0
path = `/market/create/${queryObj.value.TemplateType==1?'trip':'ad'}${searchData.value.currentMenu>=0?'/'+searchData.value.currentMenu:''}`
if(searchData.value.sellId) path = `/market/create/${queryObj.value.TemplateType==1?'trip':'ad'}${searchData.value.currentMenu>=0?'/'+searchData.value.currentMenu:''}`
else path = `/market/create`
}
else if(searchData.value.currentMenu>=0) {
path = `/space/${searchData.value.currentMenu}`
......@@ -266,12 +267,14 @@ const goBack = (type:any) =>{
// 返回是否清空数据
const setNewDatas = (type,i) => {
if(!type) {
searchData.value.TempId = 0
searchData.value.TempId2 = 0
searchData.value.sellId = 0
searchData.value.sellTempId = 0
searchData.value.TemplateType = 0
SalesBackStore.setSalesBack(0)
SalesEditorStore.setSalesEditor(0)
slidesStore.ClearSlides()
}
CoverImgStore.setCoverImg(null)
}
......
......@@ -4,13 +4,13 @@
class="origin-image"
:style="{ backgroundImage: `url(${handleImageElement.src})` }"
></div>
<Button class="full-width-btn" @click="getImgVis()" :style="{'margin-bottom': mode==1?0:''}"><IconTransform class="btn-icon"/> 替换图片</Button>
<Button class="full-width-btn" @click="getImgVis()"><IconTransform class="btn-icon"/> 替换图片</Button>
<Button class="full-width-btn" @click="getPictDef()" :style="{'margin-bottom': mode==1?0:''}">处理图清晰度</Button>
<Divider v-if="mode==1" />
<div v-if="mode==1" class="row items-center">
<div class="col">图层名称:</div>
<el-input style="width:60%;" v-model="layerName" @input="updateLayerName"></el-input>
</div>
<Divider v-if="mode==1" />
<ElementFlip />
......@@ -74,11 +74,30 @@
<Button class="full-width-btn" @click="setBackgroundImage()"><IconTheme class="btn-icon" /> 设为背景</Button>
<!-- 上传图片 -->
<UploadPicture v-show="imgReplaceVisible"></UploadPicture>
<!-- 图片处理对比 -->
<!-- <imgArticContr1 v-if="DefinitionDatas"
:oldImg="handleImageElement.src"
:newImg="DefinitionDatas"
@close="DefinitionDatas=null"
@success="DefinitionDatas=null"></imgArticContr1> -->
<imgArticContr v-if="DefinitionDatas" :width="imgWidth" :height="imgHeigth"
:newImg="DefinitionDatas"
@close="DefinitionDatas=null"
@success="DefinitionDatas=null">
<template #left>
<span style="position: absolute;left: 10px;top:10px;background: #fff;border-radius: 3px;padding:0 5px;width: 38px;">原图</span>
<img :src="handleImageElement.src" class="images" :style="{width: imgWidth+'px'}" />
</template>
<template #right>
<img :src="'data:image/png;base64,'+DefinitionDatas" class="images" :style="{width: imgWidth+'px'}" />
</template>
</imgArticContr>
</div>
</template>
<script lang="ts" setup>
import { type Ref, ref, provide } from 'vue'
import { type Ref, ref, provide, reactive } from 'vue'
import { storeToRefs } from 'pinia'
import { useMainStore, useSlidesStore, useScreenStore, useKeyboardStore } from '@/store'
import type { PPTImageElement, SlideBackground } from '@/types/slides'
......@@ -99,6 +118,13 @@ import ButtonGroup from '@/components/ButtonGroup.vue'
import Popover from '@/components/Popover.vue'
import UploadPicture from '../../CanvasTool/UploadPicture.vue'
import imgArticContr from '@/components/CloudDisk/imgArticContr.vue'
import CloudDiskService from '@/services/CloudDiskService'
import { ApiResult } from "@/configs/axios";
import AliyunUpload from '@/utils/upload/aliyun'
import { ElLoading } from "element-plus";
import FileService from '@/services/FileService'
const shapeClipPathOptions = CLIPPATHS
const ratioClipOptions = [
{
......@@ -153,6 +179,54 @@ const mode = model.value??1
provide('imgType',2)
const DefinitionLoading = ref(false)
const DefinitionDatas = ref('' as any)
const DefinParams = reactive({
basestr: '',
extname: '',
url: '',
})
const imgWidth = ref(500)
const imgHeigth = ref(0)
const getPictDef = async () =>{
if(handleImageElement.value.src.startsWith("data:image")){
let name = new Date().getTime()+".jpg"
const file = dataURLtoFile(handleImageElement.value.src, name)
let url = await AliyunUpload.UploadAsync(file,`Feature/CoverImg_${name}`)
DefinParams.url= url
}else DefinParams.url = handleImageElement.value.src
let files = DefinParams.url.split('/')
DefinParams.extname = files[files.length-1]
DefinitionImg()
}
const DefinitionImg = async () =>{
if(DefinitionLoading.value) return
DefinitionLoading.value = true
const loadingObj = ElLoading.service({
text:'正在处理图的清晰度',
lock:true
})
try {
const datasRes = await CloudDiskService.BaiduImageDefinition(DefinParams);
if (datasRes.data.resultCode==ApiResult.SUCCESS) {
DefinitionDatas.value = datasRes.data.data
}
DefinitionLoading.value = false
loadingObj.close()
} catch (error) {
DefinitionLoading.value = false
loadingObj.close()
}
}
const getImgSize = async () => {
let TempSize = await FileService.getImageSizeWithoutDownloading(handleImageElement.value.src)
let ratio = TempSize.width/imgWidth.value
imgHeigth.value = TempSize.height/ratio
}
getImgSize()
const getLockCutRatio = () =>{
keyboardStore.setCtrlKeyState(ctrlKeyState.value)
}
......
<template>
<div class="element-color-mask">
<div class="row">
<div style="width: 40%;">着色(蒙版):</div>
<div class="switch-wrapper" style="width: 60%;">
<div class="row flex-between">
<div style="width: auto;">着色(蒙版):</div>
<div class="switch-wrapper">
<Switch
:value="hasColorMask"
@update:value="value => toggleColorMask(value)"
......
......@@ -226,7 +226,7 @@
<!-- vip购买提示 -->
<vipFooter v-if="!userInfo.iv&&!userInfo.it&&!userInfo.OpenPrompt" @close="closeVip"></vipFooter>
<!-- 到顶部 -->
<BackTop v-if="marketRef&&marketRef.scrollTop>800" @BackTop="goBackTop"></BackTop>
<BackTop :scrollTop="marketRef&&marketRef.scrollTop>=0?marketRef.scrollTop:0" @BackTop="goBackTop"></BackTop>
</template>
<script setup lang="ts">
......
......@@ -31,10 +31,6 @@
<div class="item" :class="{'active':currentMenu==-1}" @click="setCurrentMenuHandler(-1)" v-if="userInfo.iv||userInfo.it"><el-icon color="#564bec" class="q-mr-md" size="16"><Delete /></el-icon>回收站</div>
</div>
<div class="tabs-items" v-if="userInfo.iv||userInfo.it">
<div class="q-mb-md q-ml-lg text-small">我的云盘</div>
<div class="item" :class="{'active':currentMenu==5}" @click="setCurrentMenuHandler(5)"><el-icon color="#564bec" class="q-mr-md" size="16"><MostlyCloudy /></el-icon>云盘空间</div>
</div>
</div>
<div class="col">
<BrowsingHistory :current-menu="currentMenu" v-if="currentMenu==0"></BrowsingHistory>
......@@ -42,7 +38,6 @@
<journeyAds :position="position" :current-menu="currentMenu" v-if="currentMenu==3||currentMenu==4" @destroy-position="()=>position=null"></journeyAds>
<RecycleBin :current-menu="currentMenu" v-if="currentMenu==-1"></RecycleBin>
<ShareList :position="position" v-if="currentMenu==2" @destroy-position="()=>position=null"></ShareList>
<CloudDiskList v-if="currentMenu==5"></CloudDiskList>
</div>
</template>
<script setup lang="ts">
......@@ -54,7 +49,6 @@ import StarTarget from './StarTarget.vue'
import ShareList from './Share.vue';
import journeyAds from './journeyAds.vue'
import RecycleBin from './RecycleBin.vue'
import CloudDiskList from './CloudDiskList.vue'
import { Plus,ArrowDown,Clock,Star,Share,Picture,Management,Delete,Setting } from '@element-plus/icons-vue';
import { useRouter } from 'vue-router';
import { openNewBlank } from '@/utils/common';
......
<template>
<CloudDiskList></CloudDiskList>
</template>
<script setup lang="ts">
import CloudDiskList from '@/components/CloudDisk/CloudDiskList.vue'
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
......@@ -28,7 +28,7 @@
<!-- <IconRight :size="20"></IconRight> -->
<div class="col"></div>
<span class="text-grey-8">还可创建:</span>
<span class="text-dark q-ml-md">0个行程</span>
<span class="text-dark q-ml-md">不限制</span>
</div>
</el-card>
<el-card class="user-card" shadow="never">
......
......@@ -30,9 +30,12 @@
</el-menu>
<el-button class="full-width pingfangr text-weight-bolder" @click="forwardSpace" style="font-size: 14px !important;" icon="arrow-left">返回工作台</el-button>
</div>
<el-scrollbar class="col full-height user-center-body full-scroll" wrap-style="overflow-x:unset;" view-style="padding-bottom:30px;">
<el-scrollbar v-if="menus[activeIndex].url!='/a/c'" class="col full-height user-center-body" wrap-style="overflow-x:unset;" view-style="padding-bottom:30px;">
<router-view />
</el-scrollbar>
<div v-else class="col full-height user-center-body" view-style="padding-bottom:30px;">
<router-view />
</div>
</div>
</div>
</template>
......
<template>
<CloudDiskList :isPersonage="1"></CloudDiskList>
</template>
<script setup lang="ts">
import CloudDiskList from '@/components/CloudDisk/CloudDiskList.vue'
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
......@@ -20,9 +20,12 @@
</el-menu>
<el-button class="full-width pingfangr text-weight-bolder" @click="forwardSpace" style="font-size: 14px !important;" icon="arrow-left">返回工作台</el-button>
</div>
<el-scrollbar class="col full-height user-center-body" wrap-style="overflow-x:unset;" view-style="padding-bottom:30px;">
<el-scrollbar v-if="menus[activeIndex].url!='/u/cloudDiskSpace'" class="col full-height user-center-body" wrap-style="overflow-x:unset;" view-style="padding-bottom:30px;">
<router-view />
</el-scrollbar>
<div v-else class="col full-height user-center-body" view-style="padding-bottom:30px;">
<router-view />
</div>
</div>
</div>
</template>
......
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